<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>博客标签</title>
    <!--百度统计-->
    <script src="/blog/js/statistics.js"></script>
    <!--animate 的css-->
    <link rel="stylesheet" type="text/css" href="/lib/animate/css/reset.css"/>
    <link rel="stylesheet" type="text/css" href="/lib/animate/css/animate.css"/>
    <!--layUI的css-->
    <link rel="stylesheet" href="/layui/css/layui.css">

</head>
<body>
<div class="layui-layout layui-layout-admin showInTop a-time1 a-delay1">
    <!--导航栏-->
    <div class="layui-header layui-bg-green">
        <div class="layui-logo  layui-bg-green"><h2 class="layui-font-cyan">Blog</h2></div>
        <ul class="layui-nav layui-layout-left layui-bg-green">
            <li class="layui-nav-item">
                <a href="index.html">
                    <button id="index_btn" hidden></button>
                    <i class="layui-icon layui-icon-home"></i>首页<span
                        class="layui-badge">9</span></a>
            </li>
            <li class="layui-nav-item layui-hide-xs">
                <a href="/blog/blog_type.html"><i class="layui-icon layui-icon-diamond"></i>分类<span class="layui-badge">9</span></a>
            </li>
            <li class="layui-nav-item layui-hide-xs layui-this">
                <a href="/blog/blog_tag.html"><i class="layui-icon layui-icon-note"></i>标签<span
                        class="layui-badge">9</span></a>
            </li>
            <li class="layui-nav-item layui-hide-xs">
                <a href="/blog/blog_timeline.html"><i class="layui-icon layui-icon-date"></i>时间线<span
                        class="layui-badge">9</span></a>
            </li>
        </ul>
        <ul class="layui-nav layui-layout-right layui-bg-green">
            <li class="layui-nav-item" name="user_li">
                <a href="#"><img src="https://picsum.photos/500" class="layui-nav-img" alt=""><span>游客</span></a>
                <dl class="layui-nav-child">
                    <dd name="not_login_to_hidden" hidden><a href="/blog/personal.html">个人中心</a></dd>
                    <dd name="not_login_to_hidden" hidden><a href="/settings/menu.html">博客管理</a></dd>
                    <dd><a href="/login.html">登录</a></dd>
                    <dd name="not_login_to_hidden" hidden><a href="#" onclick="logout()">退出</a></dd>
                </dl>
            </li>
        </ul>
    </div>

    <!--主体内容-->
    <div id="main_content" class="my_opacity" style="padding: 6em 5% 10em 5%;width: 90%">
        <!--header：标签列表-->
        <div class="layui-card">
            <div class="layui-card-header layui-bg-cyan">
                <div class="layui-row layui-col-space4">
                    <div class="layui-col-md2 layui-col-xs6">
                        <h2>标签</h2>
                    </div>
                    <div class="layui-col-md-offset8 layui-col-md2 layui-col-xs6">
                        共<span class="layui-badge" name="tag_number">12</span>个
                    </div>
                </div>
            </div>
            <div class="layui-card-body">
                <div id="tag_list" class="layui-row">
                    <div class="layui-col-md2 layui-col-xs6" style="padding: 0.5em 0.5em">
                        <button class="layui-btn layui-btn-primary"
                                onclick="tag_click('1')" name="1">
                            我草123<span class="layui-badge">10</span>
                        </button>
                    </div>
                </div>
            </div>
        </div>

        <!--content：博客列表-->
        <div id="blog_list">
            <div class="layui-card layui-bg-gray">
                <div class="layui-card-header"><h3>这是一个标题</h3></div>
                <div class="layui-card-body">
                    <div class="layui-row">
                        <div class="layui-col-md3"><a href="blog_detail.html">
                            <img src="" alt="图片"
                                 style="height: 10em;width: 100%"></a>
                        </div>
                        <div class="layui-col-md8 layui-col-md-offset1">
                            <div class="layui-row">
                                卡片式面板面板通常用于非白色背景色的主体内<br/>
                                从而映衬出边框投影......
                            </div>
                            <!--博客的标签列表-->
                            <div class="layui-row">
                                <div class="layui-col-md2 layui-col-xs6" style="padding: 0.5em 0.5em">
                                    <button class="layui-btn layui-btn-primary layui-btn-radius layui-btn-xs"
                                            onclick="tag_click('1')" name="1">
                                        我草123
                                    </button>
                                </div>
                                <div class="layui-col-md2 layui-col-xs6" style="padding: 0.5em 0.5em">
                                    <button class="layui-btn layui-btn-primary layui-btn-radius layui-btn-xs"
                                            onclick="tag_click('2')" name="2">
                                        我草123
                                    </button>
                                </div>
                                <div class="layui-col-md2 layui-col-xs6" style="padding: 0.5em 0.5em">
                                    <button class="layui-btn layui-btn-primary layui-btn-radius layui-btn-xs"
                                            onclick="tag_click('3')" name="3">
                                        我草123
                                    </button>
                                </div>
                            </div>
                            <!--博客信息-->
                            <div class="layui-row layui-col-space4">
                                <div class="layui-col-md1"><img class="layui-nav-img"
                                                                src="https://picsum.photos/100/100?image=140"
                                                                alt=""></div>
                                <div class="layui-col-md3"><a href="#"><span
                                        class="layui-font-blue">一场游戏啦啦啦</span></a>
                                </div>
                                <div class="layui-col-md3"><i class="layui-icon layui-icon-date"></i>2021-08-03
                                </div>
                                <div class="layui-col-md2"><i class="layui-icon layui-icon-senior"></i>12345
                                </div>
                                <div class="layui-col-md3">
                                    <button class="layui-btn layui-btn-xs layui-btn-radius">分类</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--页按钮-->
        <div id="blog_page_btn" class="layui-row" style="text-align: center"></div>

    </div>

    <!--底部footer-->
    <footer class="my_layui-footer">
        <div class="layui-container">
            <div class="layui-row layui-col-space10">
                <div class="layui-col-md3 layui-col-sm3">
                    <img src="/blog/img/二维码.png" alt="图片"
                         style="width: 100px; height: 100px; margin-right: 10px; border-radius: 10%;">
                </div>
                <div class="layui-col-md3 layui-col-sm3">
                    <h4>最新博客</h4>
                    <ul class="layui-nav layui-nav-tree layui-bg-gray">
                        <li class="layui-nav-item"><i class="layui-icon layui-icon-email"></i>博客1</li>
                        <li class="layui-nav-item"><i class="layui-icon layui-icon-email"></i>博客2</li>
                    </ul>
                </div>
                <div class="layui-col-md3 layui-col-sm3">
                    <h4>联系我</h4>
                    <ul class="layui-nav layui-nav-tree layui-bg-gray">
                        <li class="layui-nav-item"><i class="layui-icon layui-icon-email"></i>767719297@qq.com</li>
                        <li class="layui-nav-item"><i class="layui-icon layui-icon-cellphone"></i>15082687458</li>
                    </ul>
                </div>
                <div class="layui-col-md3 layui-col-sm3">
                    <h4>先留着</h4>
                    <ul class="layui-nav layui-nav-tree layui-bg-gray">
                        <li class="layui-nav-item"><i class="layui-icon layui-icon-email"></i>767719297@qq.com</li>
                        <li class="layui-nav-item"><i class="layui-icon layui-icon-cellphone"></i>15082687458</li>
                    </ul>
                </div>
            </div>
        </div>
    </footer>

</div>

</body>
</html>

<style>
    body {
        background-image: url("https://z3.ax1x.com/2021/08/28/hly7I1.jpg");
        background-size: 100% auto;
        background-repeat: repeat;
    }

    .my_layui-footer {
        position: relative;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 990;
        height: auto;
        line-height: 44px;
        padding: 0 15px;
        /*box-shadow: -1px 0 4px rgb(0 0 0 12%);*/
        background-color: #FAFAFA
    }

    .my_progress {
        position: fixed;
        top: 60px;
        right: 0;
        left: 0;
        z-index: 1000;
    }
</style>
<!--layUI的js-->
<script src="/layui/layui.js"></script>
<!--jQuery-->
<script src="/jquery-3.6.0.min.js"></script>
<!--引入自己的js-->
<script src="/blog/js/tag.js"></script>
<script src="/blog/js/common.js"></script>
<script src="/blog/js/background.js"></script>
<!--引入看板娘-->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css">
<script src="/lib/live2d/autoload.js"></script>